<template>
  <el-row class="classRow">
    <el-col :span="24">
      <el-form ref="form" label-width="80px" label-position="left" size="mini">
        
        <el-form-item label-width="10">
          <headImg :imgUrl="guestInfo.headurl" :showEdit="showEdit" @submit="submitImg"></headImg>
        </el-form-item>
        <el-form-item label="姓名" style="margin-right:30px;min-width: 100px">
          {{guestInfo.name}}
        </el-form-item>
        <el-form-item label="性别">
          {{guestInfo.sex|sex}}
        </el-form-item>
        
        <el-form-item label="手机号码">
          {{guestInfo.phone}}
        </el-form-item>
        
        <el-form-item label="会员等级" style="margin-right:30px;min-width: 100px">
          {{guestInfo.vipname}}
        </el-form-item>
        <el-form-item label="客户级别">
          {{guestInfo.lv}}
        </el-form-item>

        <el-form-item label="会员号">
          {{guestInfo.vipcard}}
        </el-form-item>
        
        <div style="display:flex">
          <el-form-item label="到店时间" style="margin-right:30px;min-width: 100px">
            {{guestInfo.addtime|dateTime}}
          </el-form-item>
          <el-form-item label="最后到店">
            {{guestInfo.arrivetime|dateTime}}
          </el-form-item>
        </div>      
        <el-form-item label="客户描述">
          <el-input type="textarea" v-model="guestInfo.remarks"></el-input>
        </el-form-item>
        <el-form-item style="display:none">
          <el-button type="primary">立即创建</el-button>
          <el-button>取消</el-button>
        </el-form-item>
      </el-form>
    </el-col>
  </el-row>
</template>

<script>
import headImg from '@/components/headImg.vue'
import Guest from '#/src/shop/guest.js'
import C from '#/src/common/common.js'
export default {
    name: 'index',
    data () {
        return {
            showEdit: false,
            guestInfo: {
                addtime: '',
                arrivetime: '',
                headurl: '',
                id: '',
                name: '',
                lv: '',
                phone: '',
                remarks: '',
                sex: '',
                vipname: '',
                vipcard: ''
            }
        }
    },
    methods: {
        submitImg () {
            // console.log(1111)
        },
        async getGuestInfo (id) {
            let info = await Guest.getGuestInfo(id)
            this.guestInfo = info
        }
    },
    mounted: function () {
        let data = C.getDatas()
        this.getGuestInfo(data.id)
    },
    components: {headImg}
}
</script>

<style>
  .classRow{
    color: #000
  }
  .headimg > .el-form-item__label {
    line-height: 75px;
  }
</style>
